<template>
  <ElConfigProvider :locale="elementLang">
    <router-view></router-view>
  </ElConfigProvider>
</template>

<script setup>
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
import en from 'element-plus//dist/locale//en.mjs'
import { computed } from 'vue'
import { useStore } from 'vuex'
import { ElConfigProvider } from 'element-plus'
import { generateNewStyle, writeNewStyle } from '@/utils/theme'

const store = useStore()

const elementLang = computed(() => {
  return store.getters.language === 'en' ? en : zhCn
})

generateNewStyle(store.getters.mainColor).then((newStyleText) => {
  writeNewStyle(newStyleText)
})
</script>

<style lang="scss"></style>
